// 全局变量定义模块

// ===========================
// 1. 主题色彩变量 (Theme Colors)
// ===========================
$primary-color: #f17d34;
$background-color: #fdfdfd;
$text-color: #333333;
$link-color: #0c66fc;

// ===========================
// 2. 状态色彩变量 (Status Colors)
// ===========================
$success-color: #08a34c;
$danger-color: #fc5f5f;
$info-color: #0a95c8;

// ===========================
// 3. 交互色彩变量 (Interactive Colors)
// ===========================
$divider-color: rgba(0, 0, 0, 0.1);
$list-even-color: rgba(0, 0, 0, 0.05);
$list-hover-color: rgba(0, 0, 0, 0.05);
$list-active-color: rgba(0, 0, 0, 0.1);
$mask-color: rgba(51, 51, 51, 0.5);
$shadow-color: rgba(0, 0, 0, 0.2);
$placeholder-color: #f4f4f4;

// ===========================
// 4. 尺寸变量 (Dimensions)
// ===========================
$app-header-height: 54px;
$app-music-bar-height: 64px;
$scrollbar-width: 12px;
$font-size: 13px;

// ===========================
// 5. 动效变量 (Animation)
// ===========================
$animate-duration: 300ms;

// CSS自定义属性定义（供主题系统使用）
:root {
    // ===========================
    // 1. 主题色彩 (Theme Colors)
    // ===========================
    --primaryColor: #{$primary-color};
    --backgroundColor: #{$background-color};
    --textColor: #{$text-color};
    --linkColor: #{$link-color};

    // ===========================
    // 2. 状态色彩 (Status Colors)
    // ===========================
    --successColor: #{$success-color};
    --dangerColor: #{$danger-color};
    --infoColor: #{$info-color};

    // ===========================
    // 3. 文本色彩 (Text Colors)
    // ===========================
    --headerTextColor: white;

    // ===========================
    // 4. 交互色彩 (Interactive Colors)
    // ===========================
    --dividerColor: #{$divider-color};
    --listEvenColor: #{$list-even-color};
    --listHoverColor: #{$list-hover-color};
    --listActiveColor: #{$list-active-color};
    --maskColor: #{$mask-color};
    --shadowColor: #{$shadow-color};
    --placeholderColor: #{$placeholder-color};

    // ===========================
    // 5. 布局尺寸 (Layout Dimensions)
    // ===========================
    --appHeaderHeight: #{$app-header-height};
    --appMusicBarHeight: #{$app-music-bar-height};

    // ===========================
    // 6. 组件尺寸 (Component Dimensions)
    // ===========================
    --scrollbarWidth: #{$scrollbar-width};
    --fontSize: #{$font-size};

    // ===========================
    // 7. 动效变量 (Animation)
    // ===========================
    --animate-duration: #{$animate-duration} !important;

    // ===========================
    // 8. 兼容性变量 (Deprecated)
    // ===========================
    --scrollbar-width: var(--scrollbarWidth); // @deprecated 使用 --scrollbarWidth
}